<template>
  <div id="globalheader">
    <a-carousel
      :style="{
        width: '100%',
        height: '500px',
      }"
      class="swiper"
      :auto-play="true"
      indicator-type="dot"
      show-arrow="hover"
    >
      <a-carousel-item v-for="image in images" :key="image">
        <img
          :src="image"
          :style="{
            width: '100%',
          }"
        />
      </a-carousel-item>
    </a-carousel>
  </div>
</template>

<script setup lang="ts">
import campus1 from "../assets/campus1.jpg";
import campus2 from "../assets/campus2.jpg";

const images = [campus1, campus2];
</script>
<style scoped>
#globalheader {
}

.swiper {
  /*height: 500px;*/
}
</style>
